<template>
    <div>
        <ul v-if="afterSaleProgress.type==1">
            <li v-if="afterSaleProgress.step3" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">完成退款</span><span style="float:right;color:#333333">{{afterSaleProgress.step2.time}}</span></div>
                <span>退款成功</span>
                <p style="margin:5px 0"><span>应退款：</span><span style="color:#ff4c50">￥{{afterSaleProgress.step3.Refunds}}</span></p>
                <p><span>实际退款：</span><span style="color:#ff4c50">￥{{afterSaleProgress.step3.realRefund}}</span></p>
            </li>
            <li v-if="afterSaleProgress.step2.isAgree" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">通过审核</span><span style="float:right;color:#333333">{{afterSaleProgress.step2.time}}</span></div>
                <p style="padding: 16px 0;border-top:1px solid #f5f5f5">买家已同意您的申请，正在退款中，将于1-3个工作日到账，请耐心等候…</p>
            </li>
            <li v-else style="font-size:13px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px;border-radius: 5px;overflow:hidden">
                <div style="height: 45px;line-height:45px;background:#FF4C50;padding:0 8px"><img src="../../assets/no.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle;color:#ffffff">通过失败</span><span style="float:right;color:#ffffff">{{afterSaleProgress.step2.time}}</span></div>
                <p style="padding: 16px 8px;border-top:1px solid #f5f5f5">驳回申请：{{afterSaleProgress.step2.reason}}</p>
            </li>
            <li v-if="afterSaleProgress.step1" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">提交待审核</span><span style="float:right;color:#333333">{{afterSaleProgress.step1.time}}</span></div>
                <p style="padding: 16px 0;border-top:1px solid #f5f5f5">售后申请提交成功，客服在24小时内处理，请耐心等待哦</p>
            </li>
            
        </ul>
        <!-- <ul v-if="afterSaleProgress1.type==1">
            <li v-if="afterSaleProgress1.step5" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">交易完成</span><span style="float:right;color:#333333">{{afterSaleProgress1.step5.time}}</span></div>
                <span>买家已经确认收货，交易完成</span>
            </li>
            <li v-if="afterSaleProgress1.step5" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">等待签收</span><span style="float:right;color:#333333">{{afterSaleProgress1.step5.time}}</span></div>
                <span>商品寄回，等待商家确认收货并换货</span>
                <p style="margin:5px 0"><span>快递名称：</span><span>{{afterSaleProgress1.step5.expressName}}</span></p>
                <p><span>运单号：</span><span>{{afterSaleProgress1.step5.expressNum}}</span></p>
            </li>
            <li v-if="afterSaleProgress1.step4.isAgree" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">通过审核</span><span style="float:right;color:#333333">{{afterSaleProgress1.step4.time}}</span></div>
                <span>商家已经确认收货，将于48小时内换出新的商品，请您耐心等候…</span>
            </li>
            <li v-else style="font-size:13px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px;border-radius: 5px;overflow:hidden">
                <div style="height: 45px;line-height:45px;background:#FF4C50;padding:0 8px"><img src="../../assets/no.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle;color:#ffffff">拒绝签收</span><span style="float:right;color:#ffffff">{{afterSaleProgress.step2.time}}</span></div>
                <p style="padding: 16px 8px;border-top:1px solid #f5f5f5">{{afterSaleProgress1.step4.reason}}</p>
            </li>
            <li v-if="afterSaleProgress1.step3" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">等待签收</span><span style="float:right;color:#333333">{{afterSaleProgress1.step3.time}}</span></div>
                <span>商品寄回，等待商家确认收货并换货</span>
                <p style="margin:5px 0"><span>快递名称：</span><span>{{afterSaleProgress1.step3.expressName}}</span></p>
                <p><span>运单号：</span><span>{{afterSaleProgress1.step3.expressNum}}</span></p>
            </li>
            <li v-if="afterSaleProgress1.step2.isAgree" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">通过审核</span><span style="float:right;color:#333333">{{afterSaleProgress1.step2.time}}</span></div>
                <p style="padding: 16px 0;border-top:1px solid #f5f5f5;display:block">同意申请，请您尽快寄回商品</p>
                <p style="display:block"><span>收货人：</span><span>{{afterSaleProgress1.step2.receiver}}</span></p>
                <p style="display:block"><span>联系电话：</span><span>{{afterSaleProgress1.step2.tel}}</span></p>
                <p style="display:block"><span>收货地址：</span><span>{{afterSaleProgress1.step2.address}}</span></p>
                <express-sub v-show="!afterSaleProgress1.step3"></express-sub>
            </li>
            <li v-else style="font-size:13px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px;border-radius: 5px;overflow:hidden">
                <div style="height: 45px;line-height:45px;background:#FF4C50;padding:0 8px"><img src="../../assets/no.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle;color:#ffffff">通过失败</span><span style="float:right;color:#ffffff">{{afterSaleProgress.step2.time}}</span></div>
                <p style="padding: 16px 8px;border-top:1px solid #f5f5f5">驳回申请：{{afterSaleProgress1.step2.reason}}</p>
            </li>
            <li v-if="afterSaleProgress.step1" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">提交待审核</span><span style="float:right;color:#333333">{{afterSaleProgress.step1.time}}</span></div>
                <p style="padding: 16px 0;border-top:1px solid #f5f5f5">售后申请提交成功，客服在24小时内处理，请耐心等待哦</p>
            </li>
            
        </ul>
        <ul v-if="afterSaleProgress1.type==2">
            <li v-if="afterSaleProgress1.step5" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">完成退款</span><span style="float:right;color:#333333">{{afterSaleProgress1.step5.time}}</span></div>
                <span>退款成功</span>
                <p style="margin:5px 0"><span>应退款：</span><span>{{afterSaleProgress1.step5.expressName}}</span></p>
                <p><span>实际退款：</span><span>{{afterSaleProgress1.step5.expressNum}}</span></p>
            </li>
            <li v-if="afterSaleProgress1.step4.isAgree" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">通过审核</span><span style="float:right;color:#333333">{{afterSaleProgress1.step4.time}}</span></div>
                <span>商家已经确认收货，将于48小时内换出新的商品，请您耐心等候…</span>
            </li>
            <li v-else style="font-size:13px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px;border-radius: 5px;overflow:hidden">
                <div style="height: 45px;line-height:45px;background:#FF4C50;padding:0 8px"><img src="../../assets/no.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle;color:#ffffff">拒绝签收</span><span style="float:right;color:#ffffff">{{afterSaleProgress.step2.time}}</span></div>
                <p style="padding: 16px 8px;border-top:1px solid #f5f5f5">{{afterSaleProgress1.step4.reason}}</p>
            </li>
            <li v-if="afterSaleProgress1.step3" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">等待签收</span><span style="float:right;color:#333333">{{afterSaleProgress1.step3.time}}</span></div>
                <span>商品寄回，等待商家确认收货并换货</span>
                <p style="margin:5px 0"><span>快递名称：</span><span>{{afterSaleProgress1.step3.expressName}}</span></p>
                <p><span>运单号：</span><span>{{afterSaleProgress1.step3.expressNum}}</span></p>
            </li>
            <li v-if="afterSaleProgress1.step2.isAgree" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">通过审核</span><span style="float:right;color:#333333">{{afterSaleProgress1.step2.time}}</span></div>
                <p style="padding: 16px 0;border-top:1px solid #f5f5f5;display:block">同意申请，请您尽快寄回商品</p>
                <p style="display:block"><span>收货人：</span><span>{{afterSaleProgress1.step2.receiver}}</span></p>
                <p style="display:block"><span>联系电话：</span><span>{{afterSaleProgress1.step2.tel}}</span></p>
                <p style="display:block"><span>收货地址：</span><span>{{afterSaleProgress1.step2.address}}</span></p>
                <express-sub v-show="!afterSaleProgress1.step3"></express-sub>
            </li>
            <li v-else style="font-size:13px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px;border-radius: 5px;overflow:hidden">
                <div style="height: 45px;line-height:45px;background:#FF4C50;padding:0 8px"><img src="../../assets/no.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle;color:#ffffff">通过失败</span><span style="float:right;color:#ffffff">{{afterSaleProgress.step2.time}}</span></div>
                <p style="padding: 16px 8px;border-top:1px solid #f5f5f5">驳回申请：{{afterSaleProgress1.step2.reason}}</p>
            </li>
            <li v-if="afterSaleProgress.step1" style="font-size:13px;padding:8px;background:#ffffff;width:92vw;margin:0 auto;margin-top:15px">
                <div style="height: 45px;line-height:45px"><img src="../../assets/OK@2x.png" alt="" style="width:24px;height:24px;vertical-align:middle;margin-right:10px"><span style="font-size:17px;vertical-align:middle">提交待审核</span><span style="float:right;color:#333333">{{afterSaleProgress.step1.time}}</span></div>
                <p style="padding: 16px 0;border-top:1px solid #f5f5f5">售后申请提交成功，客服在24小时内处理，请耐心等待哦</p>
            </li>
            
        </ul> -->
    </div>
</template>
<script>
import expressSub from '@/components/afterSaleStep/expressSub.vue';

    export default {
        components: {
            'expressSub':expressSub
        },
        name:'stepProgress',
        data () {
            return {
                // afterSaleProgress:{
                //     type:1,
                //     step1:{
                //         time:'2018/09/22 09:37:56',
                //     },
                //     step2:{
                //         isAgree:false,
                //         time:'2018/09/22 09:37:56',
                //     },
                //     // step3:{
                //     //     time:'2018/09/22 09:37:56',
                //     //     Refunds:500,
                //     //     realRefund:500
                //     // }
                // },
                // afterSaleProgress1:{
                //     type:2,
                //     step1:{
                //         time:'2018/09/22 09:37:56',
                //     },
                //     step2:{
                //         isAgree:true,
                //         time:'2018/09/22 09:37:56',
                //         receiver:'纳品网',
                //         address:"浙江省杭州市江干区下沙七格农贸市场二楼",
                //         tel:"13523412345",
                //         // reason:'就不给你退'
                //     },
                //     step3:{
                //         time:'2018/09/22 09:37:56',
                //         expressName:'申通快递',
                //         expressNum:'hdsgfvdfttwnjsc'
                //     },
                //     step4:{
                //         time:'2018/09/22 09:37:56',
                //         isAgree:true,
                //         reason:'11111111'
                //     },
                //     step5:{
                //         time:'2018/09/22 09:37:56',
                //         expressName:'申通快递',
                //         expressNum:'hdsgfvdfttwnjsc'
                //     },
                //     step6:{
                //         time:'2018/09/22 09:37:56',
                //     }
                // }
            }
        },
        props:['chioce','afterSaleProgress'],
        methods:{
            
        },
        mounted(){
            // this.chioce=this.chioce;
        }
    }
</script>
<style lang="scss">
    .mu-flat-button .mu-button-wrapper{
        padding:0px;
        
    }
    .mu-flat-button{
        min-width: auto
    }
</style>

